<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!doctype html>
<html class="no-js">
<jsp:include page="common/common-head.jsp"/>
<body>
<!-- Main wrapper -->
<div class="wrapper" id="wrapper">
  <!-- Header -->
  <jsp:include page="common/common-top.jsp"/>

  <!-- //Header -->

  <!-- Start Slider area -->
  <div class="slider-area brown__nav slider--15 slide__activation slide__arrow01 owl-carousel owl-theme">
    <!-- Start Single Slide -->
    <c:forEach items="${topList}" var="item">
      <div class="slide animation__style10 bg-image--8 fullscreen align__center--left" style="background-image: url(${item.path});">
        <div class="container">
          <div class="row">
            <div class="col-lg-12">
              <div class="slider__content">
                <div class="contentbox">
                  <h3>${item.name}</h3>
                  <h2>The Best <span>Online</span></h2>
                  <h2 class="another">book <span>shop </span></h2>
                  <p>${item.remark} </p>
                  <a class="shopbtn" href="/ordersItem/addItem/${item.id}?count=1">shop now</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </c:forEach>
    <!-- End Single Slide -->
  </div>
  <!-- End Slider area -->


  <!-- Start BEst Seller Area -->
  <section class="wn__product__area brown--color pt--80  pb--30">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="section__title text-center">
            <h2 class="title__be--2">推荐 <span class="color--theme">图书列表</span></h2>
            <p> </p>
          </div>
        </div>
      </div>
      <!-- Start Single Tab Content -->
      <div class="furniture--4 border--round arrows_style owl-carousel owl-theme row mt--50">

        <c:forEach items="${goodsList}" var="item">
          <!-- Start Single Product -->
          <div class="product product__style--3">
            <div class="col-lg-3 col-md-4 col-sm-6 col-12">
              <div class="product__thumb">
                <a class="first__img" href="/goods/detail/${item.id}">
                  <img src="${item.path}">
                </a>
                <div class="hot__box">
                  <span class="hot-label">${item.category}</span>
                </div>
              </div>
              <div class="product__content content--center">
                <h4><a href="/goods/detail/${item.id}">${item.name}</a></h4>
                <ul class="prize d-flex">
                  <li>$${item.money}元</li>
                </ul>
                <div class="action">
                  <div class="actions_inner">
                    <ul class="add_to_links">
                      <li><a class="wishlist" href="/ordersItem/addItem/${item.id}?count=1">
                        <i class="bi bi-shopping-cart-full"></i></a>
                      </li>
                      <li><a class="compare" href="/goods/collect/${item.id}"><i class="bi bi-heart-beat"></i></a></li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <!-- Start Single Product -->
        </c:forEach>


      </div>
      <!-- End Single Tab Content -->
    </div>
  </section>
  <!-- Start BEst Seller Area -->

  <!-- Footer Area -->
  <jsp:include page="common/common-footer.jsp"/>
  <!-- //Footer Area -->
</div>
<!-- //Main wrapper -->


<jsp:include page="common/common-script.jsp"/>
</body>
</html>
